<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>我的</title>
    <link rel="shortcut icon" type="image/x-icon" href="../img/yitiao-icon.png">
    <link rel="stylesheet" type="text/css" href="../lib/bootstrap-3.3.7/dist/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="../css/footer-bar.css">
    <style>
        .title {
            position: fixed;
            top: 0;
            z-index: 9;
            width: 100vw;
            background-color: white;
        }
        .container {
            margin-top: 30px;
        }
        h3 {
            margin-top: 10px;
            margin-left: 20px;
        }
        .iformat{
            height: 90px;
            width: 90px;
            border-radius: 50px;
        }
        .username{
            font-size: 18px;
        }
        .userid{
            font-size: 12px;
        }
        .userinfo1{
            font-size: 10px;
        }
        .userinfo2{
            font-size: 10px;
            color: #8c8c8c;
        }
        .usermotto{
            font-size: 15px;
        }
        .align{
            text-align: center;
        }
        .topper{
            margin: 3px;
        }
        .shape{
            height: 3px;
            width: 20%;
        }

        * {
            margin: 0;
            padding: 0;
        }
        section {
            width: 100%;
        }
        .row {
            width: 100%;
            margin: 0;
        }
        .col-xs-12 {
            width: 100%;
            padding: 0;
        }
    </style>
</head>
<body>
<section>
    <div class="row title">
        <h3 class="col-xs-12"><small>我的</small></h3>
    </div>
</section>
<section class="container">
    <!--在这里编辑你的内容-->
    <div class="row" style="padding-top: 20px">
        <div class="col-xs-3">
            <img class="iformat" src="../img/home/headPortrait.jpg" alt="">
        </div>
        <div class="col-xs-9" >
            <div class="row">
                <div class="col-xs-9">
                    <p class="username">BJT</p>
                </div>
                <div class="col-xs-3">
                    <a href="setting.html">
                        <button type="button" class="btn btn-default" aria-label="Left Align" >
                            <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
                        </button>
                    </a>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-9">
                    <p class="userid">ID 19931015</p>
                </div>
                <div class="col-xs-3">
                    <p> </p>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-3">
                    <p class="userinfo1" style="text-align: left">未知</p>
                </div>
                <div class="col-xs-4">
                    <p class="userinfo2">地址未填写</p>
                </div>
                <div class="col-xs-5">
                    <p class="userinfo2">星座未填写</p>
                </div>
            </div>
            <div class="row">
                <div class="col-xs-11">
                    <p class="usermotto">这个用户超级懒，啥子都没写~</p>
                </div>
                <div class="col-xs-1">
                    <p> </p>
                </div>
            </div>
        </div>

    </div>
    <div  align="center"><p style="width: 90%;height: 2px;background-color: #EEEEEE">&nbsp;</p></div>
    <div class="row topper">
        <div class="col-xs-4 align">
            <p>0</p>
            <p>关注</p>
        </div>
        <div class="col-xs-4 align">
            <p>0</p>
            <p>粉丝</p>
        </div>
        <div class="col-xs-4 align">
            <p>0</p>
            <p>获赞</p>
        </div>
    </div>
    <div ><p style="width: 100%;height: 7px;background-color: #EEEEEE">&nbsp</p></div>
    <div class="row">
        <div class="col-xs-6 align">
            <p>帖子0</p>
            <img class="shape align" src="../img/home/string.jpg" alt="">
        </div>
        <div class="col-xs-6 align">
            <p>喜欢0</p>
        </div>
    </div>
    <div class="row" align="center">
        <img style="height: 200px;width: 250px;margin-top: 50px" src="../img/home/nothing.JPG" alt="">
        <a href="release.html">
            <button type="button" class="btn btn-default" style="width: 80%;margin-top: 20px;border-radius: 10px">发布我的第一篇帖子</button>
        </a>
    </div>
</section>
<footer>
    <div id="footer-bar">
        <div class="item find">
            <a href="../index.jps" style="text-decoration: none">
                <span class="footer-title">发现</span>
            </a>
        </div>
        <div class="item follow">
            <a href="follow.jsp" style="text-decoration: none">
                <span class="footer-title">关注</span>
            </a>
        </div>
        <div class="item release">
            <a href="release.jsp" style="text-decoration: none">
                <img src="../img/find/plus.png" alt="plus" class="plus">
            </a>
        </div>
        <div class="item information">
            <a href="information.jsp" style="text-decoration: none">
                <span class="footer-title">消息</span>
            </a>
        </div>
        <div class="item home active">
            <a href="./home.jsp" style="text-decoration: none">
                <span class="footer-title">我的</span>
            </a>
        </div>
    </div>
</footer>
</body>
<script src="../lib/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="../lib/bootstrap-3.3.7/dist/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../js/footer-bar.js"></script>
</html>